<template>
	<view class="evan-form-show">
		<evan-form :hideRequiredAsterisk="hideRequiredAsterisk" ref="form" :model="post">
			<evan-form-item label="帖子标题：" prop="postTitle">
				<input class="form-input" v-model="post.postTitle" placeholder-class="form-input-placeholder" placeholder="请输入帖子标题" />
			</evan-form-item>
			<evan-form-item label="帖子内容：" prop="postContent">
				<input class="form-input" v-model="post.postContent" placeholder-class="form-input-placeholder" placeholder="请输入帖子内容" />
			</evan-form-item>
			<evan-form-item label="图片：" prop="curseCount">
			</evan-form-item>
			<uImg ref="upimg" :canUploadFile="true" :limit="limitNum" :uploadFileUrl="uploadFileUrl" :heaer="header"
			 :fileKeyName="name" :uImgList.sync="uImgList" @uploadSuccess="uploadSuccess"></uImg>
		</evan-form>
		<button @click="next" class="evan-form-show__button">确定</button>
	</view>
</template>

<script>
	import EvanForm from '@/components/evan-form/evan-form.vue'
	import EvanFormItem from '@/components/evan-form/evan-form-item.vue'
	import uImg from '@/components/zhtx-uploadImg/zhtx-uploadImg.vue'
	import base from '@/common/base.js'
	let toast = msg => {
		uni.showToast({
			title: msg,
			icon: 'none',
		});
	}
	export default {
		components: {
			EvanForm,
			EvanFormItem,
			uImg
		},
		data() {
			return {
				msg: '',
				length: 140,
				limitNum: 6,
				uploadFileUrl: base.urlPrefix + 'yoga_app/post/coachUploadPostImg',
				name: 'file', //上传的名字
				header: { // 如果需要header，请上传
				},
				uImgList: '',
				hideRequiredAsterisk: false,
				index: 0,
				post: {
					postTitle: '',
					postContent: ''
				},
				rules: {
					postTitle: {
						required: true,
						message: '请输入帖子标题'
					},
					postContent: {
						required: true,
						message: '请输入帖子内容'
					}

				}
			}
		},
		onLoad() {
			this.$nextTick(() => {
				this.$refs.form.setRules(this.rules)
			})
		},
		methods: {
			uploadSuccess(result) {
				if (result.statusCode == 200) {
					//上传成功的回调处理
					toast('上传成功')
				} else {
					toast('上传失败')
				}
			},
			upFile(postId) {
				this.$refs.upimg.uploadPostImg(postId)
			},
			next() {
				if (this.uImgList.length > 0) {
					this.$refs.form.validate((res) => {
						if (res) {
							uni.request({
								url: base.urlPrefix + 'yoga_app/post/coachSubmitPost',
								data: {
									coachId:base.coach.coachId,
									postTitle:this.post.postTitle,
									postContent:this.post.postContent
								},
								success: (res) => {
									this.upFile(res.data.object);
								}
							}); 
						}
					});
				} else {
					toast("请选择帖子图片");
				}
			},
			hideReqired() {
				this.hideRequiredAsterisk = !this.hideRequiredAsterisk
			}
		}
	}
</script>

<style lang="scss">
	.form-picker-placeholder {
		margin-right: 5rpx;
	}

	.evan-form-show {
		padding: 20rpx 30rpx;

		.form-label {
			margin-top: 30rpx;
		}

		.form-input {
			font-size: 28rpx;
			color: #333;
			text-align: right;
		}

		.form-input-placeholder {
			font-size: 28rpx;
			color: #999
		}

		&__button {
			width: 100%;
			height: 88rpx;
			border-radius: 8rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 0;
			font-size: 36rpx;
			color: #fff;
			margin-top: 20rpx;
			background-color: #2D87D5;

			&::before,
			&::after {
				border: none;
			}
		}
	}
</style>
